{extend name="property/public/insidePageBase" /}
{block name="title"}添加房间{/block}
{block name="css"}{__block__}
<style>
    body{  margin:0;  }
    .layui-iconpicker-body.layui-iconpicker-body-page .hide {display: none;}
    body .layui-iconpicker .layui-iconpicker-icon-item{ width: 20.1%; }
    body{ background-color: #ffffff; }
    .layui-upload-img-box { float:left;  margin-bottom: 2px; margin-right: 2px; background: #e0e0e0;padding: 1px; }
    .layui-upload-img {  width: 82px;   height: 82px; margin-bottom: 1px; }
</style>
{/block}
{block name="body"}
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-form  layui-form-pane">
            <div class="layui-form-item">
                <div class="layui-inline"> <label class="layui-form-label">选择设施</label>
                    <div class="layui-input-block">
                        <select name="property_fid" lay-search="">
                            <option value="">请选择或搜索</option>
                            {foreach ($listColumn as $k => $v)}
                            <option value="{$k}" {if ($k == $info['property_fid'])}selected{/if}>{$v}</option>
                            {/foreach}
                        </select>
                    </div>
                </div>
                <div class="layui-inline"> <label class="layui-form-label">设施数量</label>
                    <div class="layui-input-block">
                        <input type="text" name="num" value="{$info['num']??''}"  lay-verify="require" autocomplete="off" placeholder="请输入设备数量" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-inline"> <label class="layui-form-label">设施来源</label>
                    <div class="layui-input-block">
                        <select name="is_type" lay-search="">
                            <option value="">--请选择--</option>
                            <option value="1" {if (1 == $info['is_type'])}selected{/if}>自 备</option>
                            <option value="2" {if (2 == $info['is_type'])}selected{/if}>房 东</option>
                        </select>
                    </div>
                </div>
                <div class="layui-inline"> <label class="layui-form-label">品牌名称</label>
                    <div class="layui-input-block">
                        <input type="text" name="brand_name" value="{$info['brand_name']??''}"  autocomplete="off" placeholder="请输入品牌名称" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">设施图片</label>
                <div class="layui-input-block" id="image_info">
                    <button type="button" class="layui-btn" id="upload_imgs" lay-data="{field: 'picture',data:{dir:'property/property_facilities_access', field:'picture'}}">上传图片</button>
                    <div class="layui-upload-list" id="img_show">
                        {foreach $info['pictures'] as $k=>$v}
                        <div class="layui-upload-img-box" id="{:md5($v)}-{$k}">
                            <img src="{$v}" class="layui-upload-img checkPictureByImg">
                            <input type="hidden" name="pictures[]" value="{$v}">
                            <p>
                                <a class="layui-btn layui-btn-xs cftoggleUpload" style="float: left" lay-data="{field: 'picture',data:{dir:'property/property_facilities_access', field:'picture', replace_upload_index: '{:md5($v)}-{$k}'}}">修改</a>
                                <a class="layui-btn layui-btn-xs layui-btn-danger" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);" style="float: right">删除</a>
                            </p>
                        </div>
                        {/foreach}
                    </div>
                </div>
            </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">备注说明</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入备注说明" class="layui-textarea" name="remark">{$info['remark']??''}</textarea>
                    </div>
                </div>
            <div class="layui-form-item layui-hide">
                <button type="button" class="layui-btn layui-btn-primary replaceUploadImg toggleUpload" lay-data="{}"></button>
                <button class="layui-btn" lay-submit lay-filter="submitBtn" id="submitBtn">提交</button>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="js"}
{__block__}
<script>
    layui.use(['form', 'layer'], function () {
        var form = layui.form,layer = layui.layer,  $ = layui.$;
        $('#upload_imgs').selectImages({
            confirm:function(res,elem) {
                for(var i in res) {
                    index = (new Date()).getTime()+''+i;
                    $('#img_show').append('<div class="layui-upload-img-box" id="'+index+'">' +
                        '<img src="' + res[i].src + '" class="layui-upload-img checkPictureByImg">' +
                        '<input type="hidden" name="pictures[]" value="' + res[i].src + '">' +
                        '<p>' +
                        '<a class="layui-btn layui-btn-xs cftoggleUpload" style="float: left" lay-data="{field: \'pictures\',data:{dir:\'room/room\', field:\'pictures\', replace_upload_index: \''+index+'\'}}">修改</a>' +
                        '<a class="layui-btn layui-btn-xs layui-btn-danger" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);" style="float: right">删除</a>' +
                        '</p>' +
                        '</div>'
                    );
                }
            }
        });
        $(document).on('click', '.cftoggleUpload', function () {
            $('.toggleUpload').attr('lay-data', $(this).attr('lay-data'));
            $('.toggleUpload').trigger('click');
        });
        $('.replaceUploadImg').selectImages({
            confirm:function(res,elem,data) {
                let replaceUploadObj = $('#'+data.data.replace_upload_index);
                replaceUploadObj.find('img').attr('src', res[0].src);
                replaceUploadObj.find('img').attr('alt', res[0].src);
                replaceUploadObj.find('input').val(res[0].src);
            }
        });
        $(document).click('.delImg', function () {
            console.log(1)
            $(this).parent().remove();
        });
    });
</script>
{/block}